<template>
  <a-modal v-model:open="data.visible" width="1200px" @ok="onOk()" :destroyOnClose="true" @cancel="onCancel">


    <a-form class="smart-query-form">
      <a-row class="smart-query-form-row">



        <a-form-item label="物料编码" class="smart-query-form-item">
          <a-input  disabled style="width: 200px" v-model:value="data.queryParams.itemId" placeholder="物料编码" />
        </a-form-item>



        <a-form-item class="smart-query-form-item">
          <a-button  type="primary" @click="queryPage">
            <template #icon>
              <SearchOutlined />
            </template>
            查询
          </a-button>

        </a-form-item>
      </a-row>
    </a-form>




    <a-table style="width: 100%" rowKey="id" :scroll="{ x: 600, y: 600 }" :dataSource="data.lista" :columns="columns"
      :loading="data.tableLoading" :pagination="false"
      :row-selection="{ selectedRowKeys: data.selectDocEntrys, onChange: onSelectChange }"
      @resizeColumn="handleResizeColumn">
      <template #bodyCell="{ text, record, column, index }">
        <template v-if="column.dataIndex === 'qty'">
          <span>{{ excute(text) }}</span>
        </template>
        <template v-if="column.dataIndex === 'appQty'">
          <span>{{ excute(text) }}</span>
        </template>
        <template v-if="column.dataIndex === 'selQty'">
          <a-input-number size="small" style="width: 100%" v-model:value="record.selQty" :step="0.0001" :min="0.0000"
            :max="record.qty - record.appQty" />
        </template>
      </template>
    </a-table>
  </a-modal>
</template>
<script setup>
import { onMounted, reactive, ref } from 'vue';
import { inventordApi } from '/@/api/business/erp/inventord-api.js';
import { message } from 'ant-design-vue';
import { excute } from '/@/utils/numformat-util.js';

const emit = defineEmits(['onOk']);





const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 500,
    itemId: null,
    zero: false
  },
  reqQty: 0,
  lista: [],
  tableLoading: false,
  selectDocEntrys: [],
  selectLinea: [],
});

const columns = ref([
  {
    title: '物料编码',
    dataIndex: 'itemId',
    align: 'left',
    width: 260,
    resizable: true,
  },
  {
    title: '物料名称',
    dataIndex: 'itemName',
    align: 'left',
    width: 260,
    resizable: true,
  },
  {
    title: '单位',
    dataIndex: 'unit',
    align: 'center',
    width: 100,
    resizable: true,
  },
  {
    title: '数量',
    dataIndex: 'qty',
    align: 'right',
    width: 200,
    resizable: true,
  },

  {
    title: '选择量',
    dataIndex: 'selQty',
    align: 'right',
    width: 200,
    resizable: true,
  },
  {
    title: '系统批次',
    dataIndex: 'batchId',
    align: 'center',
    width: 260,
    resizable: true,
  },
  {
    title: '质量',
    dataIndex: 'quality',
    align: 'center',
    width: 100,
    resizable: true,
  },
  {
    title: '仓库名称',
    dataIndex: 'stoName',
    align: 'center',
    width: 200,
    resizable: true,
  },
]);

function queryPage() {
  inventordApi
    .queryPage(data.queryParams)
    .then((res) => {
      data.lista = res.data.list;
    })
    .catch((error) => {
      message.error(error);
    })
    .finally(() => { });
}

function onSelectChange(e, ev) {
  data.selectDocEntrys = e;
  data.selectLinea = ev;
}

function onOk() {
  let reqQty = 0;
  data.selectLinea.forEach((item) => {
    reqQty += item.selQty;
  });
  if (reqQty.toFixed(4) === data.reqQty.toFixed(4)) {
    emit('onOk', data.selectLinea);
    data.visible = false;
  } else {
    message.error(`需求数量 ${data.reqQty}，选择数量为${reqQty}`);
  }
}

function onCancel() {

  data.selectDocEntrys = []
  data.selectLinea = []


}

function showModal(item) {
  data.queryParams.itemId = item.itemId;
  data.reqQty = item.qty;
  queryPage();
  data.visible = true;
}


function handleResizeColumn(w, col) {
  col.width = w;
}

defineExpose({
  showModal,
});
</script>
